<template>
    <div>
        <input type="text" v-model="number"> 
        {{ number | txt }}
    </div>
</template>
<script>
    export default {
        data(){
            return {
                number: '123'
            }
        },
        filters:{
            // 过滤器会再beforeCreate生命周期前就触发
            txt(val){
                 function verfy(str){
                switch(str){
                    case '0':
                        str = '零';
                        break;  
                    case '1':
                        str = '一';
                        break; 
                    case '3':
                        str = '三';
                        break; 
                    case '4':
                        str = '四';
                        break; 
                    case '5':
                        str = '五';
                        break; 
                    case '6':
                        str = '六';
                        break; 
                    case '7':
                        str = '七';
                        break; 
                    case '8':
                        str = '八';
                        break; 
                    case '9':
                        str = '九';
                        break; 
                    case '2':
                        str = '二';
                        break;
                }
                return str
            }
                // 写一些处理的逻辑
                // console.log(val);
                // 每一次number改变的时候,都会触发
                // txt 这个事件
                // val就是 number的最新值
                let arr = val.split('');
                // 初始化一个空的字符串
                let str = '';
                // 遍历字符串的数组
                arr.forEach(item => str += verfy(item));
                // 处理后的str字符串返回出去
                // 显示在页面上
                return str
            }
        }
    }
</script>